<template>
    <el-card shadow="never" class="aui-card--fill">
        <div class="mod-sys__dict">
            <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
                <el-form-item>
                    <el-input v-model="dataForm.name" placeholder="商品名称" clearable></el-input>
                </el-form-item>
                 <!-- <el-form-item>
                    <el-select v-model="dataForm.sort" placeholder="请选择价格排序" clearable>
                        <el-option v-for="item in sort" :key="item.value" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item> -->
                <el-form-item>
                    <el-button type="primary" @click="getDataList()">{{ $t("query") }}</el-button>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="addOrUpdateHandle()">{{ $t("add") }}</el-button>
                </el-form-item>
                <!-- <el-form-item>
                    <el-button type="primary" @click="exportHandle()">导出</el-button>
                </el-form-item> -->
            </el-form>
            <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" @sort-change="dataListSortChangeHandle" style="width: 100%">
                <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
                  <el-table-column prop="coverImg" label="封面图" :show-overflow-tooltip="true" align="center">
                    <template v-slot:default="scope">
                        <el-image :src="scope.row.coverImg | imgfilter" style="max-height:120px"/>
                    </template>
                </el-table-column>
                <el-table-column prop="name" label="商品名称" header-align="center" min-width="150" align="center"></el-table-column>
                 <el-table-column prop="status" label="状态" header-align="center" width="100" align="center">
                    <template slot-scope="scope">
                        {{scope.row.status==0?'上架':'下架'}}
                    </template>
                 </el-table-column>
                <el-table-column prop="discountPrice" label="折扣价" header-align="center" width="100" align="center"></el-table-column>
                <el-table-column prop="refundRemark" label="退款说明" header-align="center" align="center" min-width="150">
                </el-table-column>
                <el-table-column prop="createDate" label="创建时间" header-align="center" align="center" min-width="150">
            </el-table-column>
                <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
                    <template slot-scope="scope">
                        <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">编辑</el-button>
                        <el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t("delete") }}</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total" layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle" @current-change="pageCurrentChangeHandle">
            </el-pagination>
            <!-- 弹窗, 新增 / 修改 -->
            <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
        </div>
    </el-card>
    </template>
    
<script>
    var that;
    import mixinViewModule from "@/mixins/view-module";
    import AddOrUpdate from "./foodBeverage-add-update";
    export default {
        mixins: [mixinViewModule],
        data() {
            return {
                mixinViewModuleOptions: {
                    getDataListURL: "/scenic/merchant/product/page",
                    getDataListIsPage: true,
                    deleteURL: "/scenic/merchant/product",
                    deleteIsBatch: true,
                    exportURL: "/scenic/merchant/product/export",
                },
                dataForm: {
                    merchantId: this.$store.state.user.superAdmin == 1 ? '' : this.$store.state.user.MerchantId,
                    merchantType:10,
                    sort:""
                },
                // 新增
                sort: [{
                        label: "价格升序",
                        value: 4,
                    },
                    {
                        label: "价格降序",
                        value: 1,
                    },
                   
                ],
            };
        },
        components: {
        AddOrUpdate,
    },
        created(){
            that=this;
        },
        filters: {
            delScenicLabel(val) {
                let str = '';
                if (val && val.length != 0) {
                    for (let i = 0; i < val.length; i++) {
                        str += that.$getDictLabel('FishermanType', val[i]) + '，'
                    }
                    return str;
                }
            },
            imgfilter(val) {
                if (val) {
                    return val.split(',')[0];
                }
            }
        },
        methods: {
    
        },
    };
    </script>
    